// 初始化数据
const state = {
  // 商品列表
  shop_list: [
    { id: 11, name: '鱼香肉丝', price: 12 },
    { id: 12, name: '宫爆鸡丁', price: 12 },
    { id: 13, name: '红烧猪蹄', price: 28 },
    { id: 14, name: '精致小菜', price: 10 },
    { id: 15, name: '米饭', price: 2 }
  ],
  // 添加到购物车里的商品（已选商品）
  added: []
}

// getter 抛出去的数据
const getters = {
  // 商品列表
  shopList: state => state.shop_list,
  // 购物车列表
  cartProducts: state => {
    return state.added.map(({ id, num }) => { // 在 actions中的 只有 id和 num
      // 在原始数据上面进行筛选，通过id匹配
      let product = state.shop_list.find(n => n.id == id)
      // console.error(product)
      // 返回筛选结果
      return {
        ...product,
        num
      }
    })
  },
  // 计算总价
  totalPrice: (state, getters) => {
    var total = 0
    getters.cartProducts.forEach(n => {
      total += n.price * n.num
    })
    return total
  },
  // 计算总数
  totalNum: (state, getters) => {
    var total = 0
    getters.cartProducts.forEach(n => {
      total += n.num
    })
    return total
  }
}

// actions 异步的操作
const actions = {
  // 添加购物车操作
  // addToCart({ commit }, product) { // 传递 add 方法，携带参数 id
  //   commit('add', { id: product.id })
  //   // console.error(product) // 当前商品所有信息
  // },
  addToCart: (context, product) => {
    context.commit('add', { id: product.id })
  },
  // 清空购物车
  clearAll({ commit }) {
    commit('clear')
  },
  // 删除指定的商品
  delProduct({ commit }, product) {
    commit('delete', {
      id: product.id
    })
  }
}

// mutations
const mutations = {
  // 执行购物车操作
  // add: commit传递过来的方法名，这里的{ id }的值和传递的过来的参数{id:product.id}对应值一致
  add(state, { id }) {
    // state.added 对象中定义了一个数组added，用来存放已经添加到购物车的商品对象
    // 2个属性 一个 id 一个 num
    let record = state.added.find(n => n.id == id) // 若这个数组中有和这次添加的新增物品id相同时
    // console.error(record)
    if (!record) { // 满足这个表示 商品没有添加过
      state.added.push({
        id,
        num: 1
      })
    } else {
      record.num++
    }
    // console.warn(state.added)
  },
  // 清空
  clear(state) {
    state.added = []
  },
  delete(state, { id }) {
    state.added.forEach((n, i) => {
      if (n.id == id) {
        state.added.splice(i, 1)
      }
    })
  }
}


export default {
  state,
  mutations,
  actions,
  getters
}